<!DOCTYPE html>
<html lang="zh-CN">
<%@ page language="java" import="com.siysoft.tc.base.bean.to.User,com.siysoft.util.COMMON" pageEncoding="UTF-8"%>
<%	
User us = (User)session.getAttribute("user");
if(us==null){
		response.sendRedirect(request.getContextPath()+"/app/login_index.htm");
		return;
}
%>

<head>
<title>PersonalInformation</title>
<%@include file="/common/head.jsp"%>
</head>
  <body onload="init()">
 <div class="filterBg"></div>  
    <div class="header">
    	<%@include file="/common/header.jsp"%>
        <div class="head">
        	<div class="container">
            	<div class="logo"><a href="<%=request.getContextPath()%>/app/index.htm"><span class="logoF f35"><span style="color:#19d4b3">TC</span><span style="color:#2d3a4c">LOGO</span></span></a></div>
                <div class="nav">
                	<a href="<%=request.getContextPath()%>/app/index.htm">Home</a><a class="on" href="<%=request.getContextPath()%>/app/personal.htm">Personal</a><a href="<%=request.getContextPath()%>/app/protocol.htm">Protocal</a> 
                </div>
            </div>
        </div>
        
    </div>
    
	<div class="personal-top">
    	<div class="container">
    		<div class="photo"><c id="user_avatar"><img src="<%=request.getContextPath()%>/common/images/photo.png"></c></div>
            <div class="text">
            	<p class="p1"><b id ="user_name"></b></p>
                <p class="p2">GRADE:<b id ="user_grade"></b>&nbsp;EMAIL:<b id ="user_email"></b></p>
                <p class="p3">ID:<b id ="user_student_id"></b>&nbsp;TELEPHONE:<b id ="user_telephone"></b></p>
            </div>
            <div class="apply" id="apply"><div class="t">Apply for Lecturer</div><div class="fl"><span><img src="<%=request.getContextPath()%>/common/images/jt1.png" width="19" height="36"></span>Call us :010-000-1203</div></div>
            <div class="xiugai"><img src="<%=request.getContextPath()%>/common/images/bi.png"></div>
        </div>
    </div>	
    <div class="personal-tab container">
    	<ul>
        	<li class="on">Information</li>
            <li>Reservation</li>
            <li>Account</li>
            <li id="system_message_button">System Message<c id="system_message_new_remind"></c></li>
            <li id="personal_message_button">Personal Message<c id="personal_message_new_remind"></c></li>
        </ul>
    </div>
	<div class="personal-cont container" style=" display:block">
    	<div class="personal-cont1">
        	<div class="t">HISTORY</div>
            <ul class="ul1" id="reservation_history">
            </ul>
            <div class="more">Show More<span class="glyphicon glyphicon-menu-down"></span></div>
        </div>
        
        <div class="personal-cont1" style=" margin-top:15px">
        	<div class="t">ASSESSMENT LIST</div>
            <ul class="ul2" id="assessment">
            </ul>
            <div class="more">Show More<span class="glyphicon glyphicon-menu-down"></span></div>
        </div>
    </div>
    <div class="personal-cont container" style="margin-top:-40px">
    	<div class="row reservation" >
        	<div class="col-md-3 one" id="reservation">
            	<div class="cont" id="add_reservation">
                	<p class="add"><img src="<%=request.getContextPath()%>/common/images/add.gif"></p>
                    <p>new</p>
                </div>
                <div class="footer"></div>
            </div>
            
        </div>
    </div>
	
    <div class="personal-cont container">
    	<div class="personal-cont1">
        	<div class="t">TRADING HISTORY</div>
            <ul class="ul1" id="account">
            </ul>
            <div class="more">Show More<span class="glyphicon glyphicon-menu-down"></span></div>
        </div>
    </div>
    
    <div class="personal-cont container">
    	<div class="personal-cont1">
        	<div class="t">System Message</div>
            <ul class="ul3" id="system_message">
            </ul>
            <div class="more">Show More<span class="glyphicon glyphicon-menu-down"></span></div>
        </div>
    </div>
    
    <!-- 私人聊天html -->
	<%@include file="/common/personal_chat.jsp"%>  
    
    <!-- 修改用户资料html -->
   	<%@include file="/common/personal_user_info.jsp"%>   
 

<!----上传头像----->
<%@include file="/common/uploadjs.jsp"%>

<!----reservation_detail_page----->
<%@include file="/common/reservation_detail.jsp"%>
<!----reservation_detail_chat----->
<%@include file="/common/reservation_chat.jsp"%> 

<!-- personal_detail -->
<%@include file="/common/personal_detail.jsp"%> 
<!-- teacher_detail -->
<%@include file="/common/teacher_detail.jsp"%> 

<!--reach goal-->
<div class="dropOut2" id="evaluate_reach_goal">
	<div class="title">Do you reach your goal?</div>
    <div class="button">
    	<a href="javascript:;" class="yes">Yes</a>
        <a href="javascript:;" class="no">No</a>
    </div>
</div>

   <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="<%=request.getContextPath()%>/common/js/jquery.min.js"></script>
    <script src="<%=request.getContextPath()%>/common/js/jquery.form.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="<%=request.getContextPath()%>/common/js/bootstrap.min.js"></script>
    <script src="<%=request.getContextPath()%>/common/js/lightbox-2.6.min.js"></script>
    
    <!--轮播图-->
    <script src="<%=request.getContextPath()%>/common/js/jquery.flexslider-min.js"></script>
    <script src="<%=request.getContextPath()%>/common/js/base.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/common/js/jquery.range.js"></script>
	<!-- 日期时间插件 -->
	<script type="text/javascript" src="<%=request.getContextPath()%>/common/js/adddate.js"></script>
    
    <script>
$(function(){
	if(<%=request.getAttribute("type")%> == 1){
		reservation_detail(<%=request.getAttribute("user_id")%>, <%=request.getAttribute("reservation_id")%>,<%=request.getAttribute("user_type")%>, '<%=request.getAttribute("user_name")%>');
	}
	$('.single-slider').jRange({
		from: 0,
		to: 100,
		step: 1,
		scale: [0,25,50,75,100],
		format: '%s',
		width: 300,
		showLabels: true,
		showScale: true
	});
	$('.range-slider').jRange({
		from: 0,
		to: 100,
		step: 1,
		scale: [0,25,50,75,100],
		format: '%s',
		width: 300,
		showLabels: true,
		isRange : true
	});
	
	$(".g1").click(function(){
		var aa = $(this).siblings(".single-slider").val();
		alert(aa);
	});

});
</script>




    
    <script>  
 	
 	function reservation_list(user_id, user_type, user_name){
 		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/user/reservation.htm",
			data:{
				"id":user_id
			},
			async:false,
			success:function(data){
				var re = data.data.reservation;
				var reservation_html="";
				reservation_html = reservation_html
				+ '<div class="col-md-3 one" id="reservation">'
				+ '<div class="cont" id="add_reservation">'
				+ '<p class="add"><img src="<%=request.getContextPath()%>/common/images/add.gif"></p>'
				+ '<p>new</p>'
				+ '</div>'
				+ '<div class="footer"></div></div>';
				for(var i = 0; i < re.length; i++){
					var pay_status = "";
					if(re[i].user_reservation_status < 2){
						pay_status = "Not Paid";
					}
					else{
						pay_status = "Already Paid";
					}
					var ispublic = "";
					if(re[i].reservation_ispublic == 0){
						ispublic = "Public";
					}
					else{
						ispublic = "Private";
					}
					var reservation_time=re[i].reservation_time.time;//时间戳				
					reservation_time=jsonDateFormat(String(reservation_time));
					//console.log(reservation_time)
					reservation_html = reservation_html
					+ '<div class="col-md-3"><div class="cont"><p>COURSE : '
					+ re[i].reservation_course + '</p><p>TIME : '
					+ reservation_time + '</p><p>ADDRESS : '
					+ re[i].reservation_address + '</p><p>STATUS : '
					+ pay_status + '</p><p>TYPE : '
					+ ispublic + '</p>'
					+ '<input type="hidden" id="reservation_id" value="' + re[i].reservation_id + '"/>'
					+ '</div><div class="footer">NUMBER:'
					+ re[i].reservation_number + '</div></div>';
				}
				$(".reservation").html(reservation_html);
				
				$("#add_reservation").on("click",function(){
					$(".reservation_window").show();//reservation_process
					$(".filterBg").show();
				})
				
				//alert(reservation_html);
				$(".reservation .col-md-3:not(:first-child)").on("click",function(){
					if(!$(this).hasClass("on")){
						//alert($(this).find("#reservation_id").val());
						reservation_id = $(this).find("#reservation_id").val();
						int = window.clearInterval(int);
						int=window.setInterval(_foo1(reservation_id),5000);
						reservation_detail(user_id, reservation_id, user_type, user_name);
					}
				});				
			}
		});
 	}
 	
 	function _foo2(user_id)
	{
		return function(){detectRemind(user_id);};
	}
 	
 	function detectRemind(user_id){
 		//detect new system message
 		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/remind/hasNewRemind.htm",
			data:{
				"user_id":user_id,
				"type":1
			},
			async:false,
			success:function(data){
				if(data.data.result == 1){
					$("#system_message_new_remind").html('<c class="addNewRemind">●</c>');
				}
			}
		})
		
		//detect new personal message
 		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/remind/hasNewRemind.htm",
			data:{
				"user_id":user_id,
				"type":2
			},
			async:false,
			success:function(data){
				if(data.data.result == 1){
					$("#personal_message_new_remind").html('<c class="addNewRemind">●</c>');
				}
			}
		})
 	}
 	
 	function cancelRemind(user_id, type){
 		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/remind/cancelRemind.htm",
			data:{
				"user_id":user_id,
				"type":type
			},
			async:false,
			success:function(data){
			}
		})
 	}
 	
 	function addPersonalmessageRemind(user_id){
		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/remind/addNewRemind.htm",
			data:{
				"data_id":user_id,
				"type":2
			},
			async:false,
			success:function(data){
			}
		})
 	}
 	
 	function getSystemMessage(user_id){
 		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/user/systemmessage.htm",
			data:{
				"id":user_id,
				"limit":-1,
				"offset":-1
			},
			async:false,
			success:function(data){
				var sys = data.data.systemmessage;
				var sys_html = "";
				for(var i = 0; i < sys.length; i++){
					var content = sys[i].system_message_content
					if(content.indexOf("index") != -1){
						sys_html = sys_html
							+ '<li><a class="" href="'+ sys[i].system_message_content+'">' + "Course Invite"
							+ '</a></li>';
					}
					else{
						sys_html = sys_html
							+ '<li><span class="">' + sys[i].system_message_content
							+ '</span></li>';
					}
				}
				$("#system_message").html(sys_html);
			}
		});
 	}
 	
 	function getPersonalMessage(user_id){
 		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/user/personal_chat_list.htm",
			data:{
				"id":user_id,
				"limit":-1,
				"offset":-1
			},
			async:false,
			success:function(data){
				var pc = data.data.personal_chat;
				var personal_chat_list_html = "";
				for(var i = 0; i < pc.length; i++){
					personal_chat_list_html = personal_chat_list_html
					+ '<li><span class="photo"><img src="<%=request.getContextPath()%>/'
					+ pc[i].personal_chat_sender_avatar + '"></span> '
					+ pc[i].personal_chat_sender_user_name + ': '
					+ pc[i].personal_chat_content
					+ '<span class="glyphicon glyphicon-chevron-right"></span>'
					+ '<input type="hidden" class="sender_id" value="' + pc[i].personal_chat_sender_id + '"/>'
					+ '<input type="hidden" class="sender_name" value="' + pc[i].personal_chat_sender_user_name + '"/>'
					+ '</li>';
				}
				$("#personal_chat_list").html(personal_chat_list_html);
				$("#personalList .glyphicon-chevron-right").on("click",function(){
					$(this).parents("#personalList").hide();
					sender_name = $(this).next().next().attr("value");
					sender_id = $(this).next().attr("value");
					$(".personal_chat_sender_name").html(sender_name);
					$.ajax({
						type:"get",
						url:"<%=request.getContextPath()%>/app/user/personal_chat_detail.htm",
						data:{
							"user_id1":user_id,
							"user_id2":sender_id,
							"limit":-1,
							"offset":-1
						},
						async:false,
						success:function(data){
							var pc = data.data.personal_chat;
							var personal_chat_detail_list_html = "";
							for(var i = 0; i < pc.length; i++){
								if(pc[i].personal_chat_sender_user_name == sender_name){
									personal_chat_detail_list_html = personal_chat_detail_list_html + '<ul class="slist1">';
								}
								else{
									personal_chat_detail_list_html = personal_chat_detail_list_html + '<ul class="slist2">';
								}
								personal_chat_detail_list_html = personal_chat_detail_list_html
								+ '<li><span class="photo"><img src="<%=request.getContextPath()%>/'
								+ pc[i].personal_chat_sender_avatar + '"></span> '
								+ pc[i].personal_chat_content + '</li></ul>';
							}
							$("#personal_chat_detail_list").html(personal_chat_detail_list_html);
						}
					})
					$(".personal_meassage_detais").show();
				})
				
			}
		})
 	}

	$(document).ready(function(){
		var user_id = <%=us.getUser_id() %>;
		var user_type = <%=us.getUser_type() %>;
        var user_name = '<%=us.getUser_name() %>';
        user_school_confirm = "<%=us.getUser_school()%>";
        int = 0;
        
        int_detectRemind=window.setInterval(_foo2(user_id),5000);
        
        $("#system_message_button").on("click",function(){
        	cancelRemind(user_id, 1);
	    	$("#system_message_new_remind").html('');
	    	getSystemMessage(user_id);
	    })
	    
	    $("#personal_message_button").on("click",function(){
	    	cancelRemind(user_id, 2);
	    	$("#personal_message_new_remind").html('');
	    	getPersonalMessage(user_id);
	    })
	    
	    $.ajax({
				type:"get",
				url:"<%=request.getContextPath()%>/app/user/school.htm",
				data:{
				},
				async:false,
				success:function(data){
					s = data.data.school;
					school_list_html = "";
					for(var i = 0; i < s.length; i++){
						school_list_html = school_list_html
						+ '<option value="'+ s[i].school_name
						+ '">'+ s[i].school_name +'</option>';
					};
					$("#student_update_school").html(school_list_html);
				},
				error:function(){
					alert('获取学校列表失败');
				}
		});
					
		$("#student_update_school").val(user_school_confirm); 
	    
	    
	    $.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/user/school.htm",
			data:{
			},
			async:false,
			success:function(data){
				s = data.data.school;
				school_list_html = "";
				for(var i = 0; i < s.length; i++){
					school_list_html = school_list_html
					+ '<p><a href="#" class="school_confirm">' + s[i].school_name
					+ '</a></p>';
				}
				$("#school_list").html(school_list_html);
				
				$(".school_confirm").on("click", function(){
					$("#user_school").html($(this).html());
					user_school_confirm = $(this).html();
				})
			}
		});
        
		var lecture_html = "";
        if(user_type == 0){
            lecture_html = '<li><span class="dis">Lecturer:</span><input type="text" class="input new_reservation_lecture" name="lecture" onblur="new_lecture_search(this)"></li>';
        }
        else{
            lecture_html = '<li class="text"><span class="text">Lecturer:'
            + user_name + '</span></li>';
        }
        $(".apply_lecture").html(lecture_html);
        
        
        
		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/user/info.htm",
			data:{
				"id":user_id,
				"reservation_limit":-1,
				"reservation_offset":-1,
				"assessment_limit":-1,
				"assessment_offset":-1
			},
			async:false,
			success:function(data){
			//这里定义全局的用户头像
				var info = data.data.user;
				user_avatar = info.user_avatar;
				var user_avatar_html = '<img src="<%=request.getContextPath()%>/'+info.user_avatar+'">';
				$("#user_avatar").html(user_avatar_html);
				$(".userHead").attr("src",'<%=request.getContextPath()%>/' + info.user_avatar);
				$("#user_name").html(info.user_name);
				$("#user_grade").html(info.user_grade);
				$("#user_email").html(info.user_email);
				$("#user_student_id").html(info.user_student_id);
				$("#user_telephone").html(info.user_telephone);
				var reservation_history_html = "";
				for(var i = 0; i < info.user_reservation_history.length; i++){
					var re = info.user_reservation_history[i];
					reservation_history_html = reservation_history_html
					+ "<li><span>" + re.reservation_history_course + "</span>"
					+ '<input type="hidden" class="reservation_history_id" value="' + re.reservation_history_id + '"/>'
					+ "<span>" + jsonDateFormat(String(re.reservation_history_time)) + "</span><span>TARGET&nbsp"
					+ re.reservation_history_goal
					+ '</span><span>NUMBER&nbsp<em class="green">' + re.reservation_history_number
					+ '</em></span><span>TEACHER&nbsp<em class="green">' + re.reservation_history_teacher_name
					+ "</em></span></li>";
				}
				$("#reservation_history").html(reservation_history_html);
				var assessment_html = "";
				for(var i = 0; i < info.user_assessment.length; i++){
					var ass = info.user_assessment[i];
					assessment_html = assessment_html
					+ '<li><span class="radius"></span> <span class="blue">'
					+ ass.assessment_user_name + "</span>  :"
					+ ass.assessment_content + "</li>";
				}
				$("#assessment").html(assessment_html);
				$(".personal-top .xiugai").on("click",function(){
					if(info.user_type == 1){
						$("#teacher_update").show();
					}
					else{
						$("#student_update").show();
					}
					//$(".modify-information").show();
					$(".filterBg").show();	
				});
				
				$("#reservation_history li").on("click", function(){
					var reservation_history_id = $(this).find(".reservation_history_id").val();
					reservation_detail(user_id, reservation_history_id, user_type, user_name);
		        })
				
				$("#teacher_update_button").on("click", function(){
					$.ajax({
						type:"post",
						url:"<%=request.getContextPath()%>/app/update/teacher.htm",
						data:{
							"id":user_id,
							"name":$("#teacher_update_name").val(),
							"grade":$("#teacher_update_grade").val(),
							"telephone":$("#teacher_update_telephone").val(),
							"wage":$("#teacher_update_wage").val(),
							"description":$("#teacher_update_description").val()
						},
						async:false,
						success:function(data){
							alert(data.data.result);
							$("#user_name").html($("#teacher_update_name").val());
							$("#user_grade").html($("#teacher_update_grade").val());
							$("#user_telephone").html($("#teacher_update_telephone").val());
						}
					});
				});
				$("#student_update_button").on("click", function(){
					$.ajax({
						type:"post",
						url:"<%=request.getContextPath()%>/app/update/student.htm",
						data:{
							"id":user_id,
							"name":$("#student_update_name").val(),
							"school":$("#student_update_school").val(),
							"grade":$("#student_update_grade").val(),
							"student_id":$("#student_update_student_id").val(),
							"email":$("#student_update_email").val(),
							"telephone":$("#student_update_telephone").val()
						},
						async:false,
						success:function(data){
							alert(data.data.result);
							
							$("#user_name").html($("#student_update_name").val());
							$("#user_grade").html($("#student_update_grade").val());
							$("#user_email").html($("#student_update_email").val());
							$("#user_student_id").html($("#student_update_student_id").val());
							$("#user_telephone").html($("#student_update_telephone").val());
							
						}
					});
				});
			}
		});
		
		reservation_list(user_id, user_type, user_name);
		
		$.ajax({
			type:"get",
			url:"<%=request.getContextPath()%>/app/user/account.htm",
			data:{
				"id":user_id,
				"limit":-1,
				"offset":-1
			},
			async:false,
			success:function(data){
				var ac = data.data.account;
				var account_html = "";
				for(var i = 0; i < ac.length; i++){
					var status = "";
					if(ac[i].account_status == 0){
						status = "PAYMENT FAIL";
					}
					else{
						status = "PAYMENT SUCCESS";
					}
					var str_money = ac[i].account_money;
					if(ac[i].account_type == 0){
						str_money += "(wage)";
					}
					else{
						str_money += "(bonus)";
					}
					var account_time=ac[i].account_time;
					account_time=jsonDateFormat(String(account_time));
					//alert(account_time)
					account_html = account_html
					+ "<li><span>" + ac[i].account_course
					+ '</span><span>NUMBER:&nbsp<em class="green">' + ac[i].account_reservation_number
					+ "</em></span><span>" + account_time + "</span><span>MONEY:&nbsp"
					+ str_money + "</span><span>STATUS:&nbsp" + status
					+ "</span></li>";
				}
				$("#account").html(account_html);
			}
		});
		
		getSystemMessage(user_id);
		
		getPersonalMessage(user_id);
		
		$("#personal_chat_send").on("click",function(){
			addPersonalmessageRemind(sender_id);
			$.ajax({
				type:"get",
				url:"<%=request.getContextPath()%>/app/user/personal_chat_send.htm",
				data:{
					"sender_id":user_id,
					"receiver_id":sender_id,
					"content":$("#personal_chat_content").val()
				},
				async:false,
				success:function(data){
					var pc = data.data.personal_chat;
					var personal_chat_detail_list_html = $("#personal_chat_detail_list").html();
					personal_chat_detail_list_html = personal_chat_detail_list_html + '<ul class="slist2">';
					personal_chat_detail_list_html = personal_chat_detail_list_html
					+ '<li><span class="photo"><img src="<%=request.getContextPath()%>/' + user_avatar +'"></span>'
					+ $("#personal_chat_content").val() + '</li></ul>';
					$("#personal_chat_detail_list").html(personal_chat_detail_list_html);
					
				}
			})
			$(".personal_meassage_detais").show();
		})

		
	});
	
		
	
	//获取被选中的radio
	$('.reservation2_radio').on("click",function(){
		alert($('input:radio[name="personal_radio"]:checked').index())
	})
	
	//$("#room_chat_content").blur(function(){
		//$(this).val("Leave a message?");
	//})
	
</script>
 		
  </body>
</html>